import React from "react";
import classes from "./drawer.module.less";
import Portal from "@mui/material/Portal";
import Slide from "@mui/material/Slide";
import { walletRootRef } from "../../utils";
import classNames from "classnames";
import { jsx as _jsx } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
function Drawer(props) {
    return /*#__PURE__*/ _jsx(Portal, {
        container: walletRootRef.current,
        children: /*#__PURE__*/ _jsxs("div", {
            className: classNames(classes.drawer_root, props.className, props.open ? "" : classes["drawer_root_hidden"]),
            children: [
                /*#__PURE__*/ _jsx("div", {
                    className: classNames(classes.mask, "ona_mask"),
                    style: {
                        visibility: props.open ? "visible" : "hidden",
                        opacity: props.open ? 1 : 0,
                        transition: props.open ? "opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms" : "none"
                    },
                    onClick: props.onClose
                }),
                props.content ? /*#__PURE__*/ _jsx(_Fragment, {
                    children: props.content
                }) : /*#__PURE__*/ _jsx(Slide, {
                    in: !!props.open,
                    direction: props.direction || "up",
                    className: classNames(classes["slide_".concat(props.direction || "up")], classes.slide),
                    children: /*#__PURE__*/ _jsx("div", {
                        className: classes.drawer_content,
                        children: props.children
                    })
                })
            ]
        })
    });
}
export default Drawer;

 //# sourceMappingURL=index.js.map